<template>
  <!-- 查询 -->
  <div class="searchBar">
    <!-- <el-tooltip class="item" effect="dark" content="Top Center 提示文字" placement="top">
        <span class="el-icon-question details-icon"></span>
    </el-tooltip> -->
    <span style="font-size: 14px"> 数据源类型 ：</span>
    <el-select
      margin-lift:100px
      clearable
      @change="changevalue"
      v-model="dataPanel"
      placeholder="请选择"
    >
      <el-option
        v-for="item in tableData"
        :key="item.id"
        :label="item.dataSourceType"
        :value="item.id"
      ></el-option>
    </el-select>
    <el-button
      style="margin-left: 30px"
      type="primary"
      size="small"
      @click="inquire"
      >搜索</el-button
    >
    <el-button
      style="margin-left: 30px"
      type="primary"
      size="small"
      @click="search"
      >添加</el-button
    >
  </div>
</template>

<script>
export default {
  data() {
    return {
      // 数据源类型下拉框
      dataPanel: "",
      // 向后台传的分页数据
      name: {
        pageNum: 1,
        pageSize: 10,
        dataSourceType: null,
      },
    };
  },
  props: {
    tableData: {
      type: Array,
      default: () => {},
    },
  },
  methods: {
    //   下拉选中事件
    changevalue(value) {
      this.dataPanel = value;
    },
    //搜索
    inquire() {
      this.name.pageNum = 1;
      this.name.pageSize = 10;
      this.name.dataSourceType = this.dataPanel;
      this.$emit("PagingQueryAssignment",this.name)
    },
    // 添加按钮事件
    search() {
        this.$emit("ResetData",true)
        this.$emit("isEditTable",false)
        this.$emit("Modify","添加")
        this.$emit("isDialog",true)
    },
  },
};
</script>

<style scoped>
.searchBar {
  height: 60px;
  line-height: 60px;
}
.el-icon-question {
  color: rgb(182, 177, 177);
}
</style>